<!DOCTYPE html>
<body>
<script src="../../../resources/js-test.js"></script>
<script src="../resources/common.js"></script>
<input type="range" min="0" max="2" id="range1">
<input id="text1">
<script>
var range1 = $('range1');
range1.value = '0';
range1.addEventListener('input', function() {
    if (range1.value == '1')
        range1.disabled = true;
}, false);

debug('Check if disabling on value change on mousedown works:');
clickElement(range1);
shouldBeEqualToString('range1.value', '1');
// Make sure mouse-capturing is released.
clickElement($('text1'));
shouldBeEqualToString('document.activeElement.id', 'text1');

debug('Check if disabling on value change on mousemvoe works:');
range1.disabled = false;
range1.value = '0';
eventSender.mouseMoveTo(range1.offsetLeft, range1.offsetTop);
eventSender.mouseDown();
eventSender.mouseMoveTo(range1.offsetLeft + range1.offsetWidth / 2, range1.offsetTop);
eventSender.mouseUp();
shouldBeEqualToString('range1.value', '1');
// Make sure mouse-capturing is released.
clickElement($('text1'));
shouldBeEqualToString('document.activeElement.id', 'text1');
</script>
</body>
